.cq-content{
    width: 100%;
    padding: 20px;
    background:rgba(245,247,250,1);
    box-sizing: border-box;
}
.cq-count{
    margin-bottom: 10px;
    border: 1px solid #D7D7D9FF;
    background: #FFFFFFFF;
}
.monthtitle, .left-title, .right-title{
    border-bottom: 1px solid #D7D7D9FF;
}
.genre-count{
    height: 110px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.monthtitle p,.left-title p, .right-title p{
    padding: 14px 0 14px 20px;
    font-size:16px;
    font-family:PingFangSC;
    font-weight:500;
    color:rgba(51,51,51,1);
}
.genre-count .count-tab{
    width: 25%;
    display: flex;
    padding: 15px 0 15px 40px;
}
.genre-count .count-tab:nth-of-type(1) .icon{
    width: 60px;
    height: 60px;
    margin-right: 20px;
    background: url(../imgs/b1.png) no-repeat center;
    background-size: cover;
}
.genre-count .count-tab:nth-of-type(2) .icon{
    width: 60px;
    height: 60px;
    margin-right: 20px;
    background: url(../imgs/b2.png) no-repeat center;
    background-size: cover;
}
.genre-count .count-tab:nth-of-type(3) .icon{
    width: 60px;
    height: 60px;
    margin-right: 20px;
    background: url(../imgs/b3.png) no-repeat center;
    background-size: cover;
}
.genre-count .count-tab:nth-of-type(4) .icon{
    width: 60px;
    height: 60px;
    margin-right: 20px;
    background: url(../imgs/b4.png) no-repeat center;
    background-size: cover;
}
.count-tab .cq-title{
    font-size:14px;
    margin: 3px 0;
    font-family:PingFangSC;
    font-weight:400;
    color:rgba(153,153,153,1);
}
.count-tab .cq-num{
    font-size:26px;
    font-family:PingFangSC;
    font-weight:600;
    color:rgba(51,51,51,1);
}
.cq-list{
    display: flex;
    justify-content: space-between;

}
.left-list{
    width: 70%;
    margin-right: 20px;
    background: #FFFFFFFF;
    border:1px solid rgba(215,215,217,1);
}
.right-list{
    width: 30%;
    background: #FFFFFFFF;
    border:1px solid rgba(215,215,217,1);
}
.cq-ranking{
    padding: 10px 20px;
    box-sizing: border-box;
}
.cq-ranking .top-tab{
    padding: 10px 0;
    overflow: hidden;
    background:rgba(237,241,247,1);
    box-shadow:0px 1px 0px 0px rgba(242,242,242,1);
}
.top-tab span{
    font-size:14px;
    font-family:PingFangSC;
    font-weight:400;
    color:rgba(102,102,102,1);
}
.top-tab span:nth-of-type(1){
    display: block;
    padding-left: 10px;
    width: 20%;
    float: left;
}
.top-tab span:nth-of-type(2){
    display: block;
    width: 55%;
    float: left;
}
.top-tab span:nth-of-type(3){
    display: block;
    /* width: 10%; */
    float: left;
}
.top-tab span:nth-of-type(4){
    margin: 0 3px;
    float: left;
}
.top-tab span:nth-of-type(5){
    float: left;
}
.top-tab .select{
    color: #4FA0F9FF;
}
.rankingnews{
    margin-top: -10px;
}
.rankingnews tr td:nth-of-type(3).up{
    color: #D65A36FF;
}
.rankingnews tr td:nth-of-type(3).up i{
    display: inline-block;
    margin-left: 60px;
    margin-right: 10px;
    width: 10px;
    height: 6px;
    vertical-align: middle;
    margin-top: -3px;
    background: url(../imgs/up.png) no-repeat center;
    background-size: 100% 100%;
}
.rankingnews tr td:nth-of-type(3).down i{
    display: inline-block;
    margin-left: 60px;
    margin-right: 10px;
    width: 10px;
    height: 6px;
    vertical-align: middle;
    margin-top: -3px;
    background: url(../imgs/down.png) no-repeat center;
    background-size: 100% 100%;
}
.browse-ranking{
    padding: 10px 20px;
    box-sizing: border-box; 
}
.browse-ranking li{
    display: flex;
    justify-content: space-between;
    height: 42px;
    align-items: center;
}
.browse-ranking li span:nth-of-type(1){
    width: 18px;
    height: 18px;
    text-align: center;
    color: #FFFFFFFF;
    background: #D7D7D9FF;
    border-radius: 9px;
}
.browse-ranking li span:nth-of-type(1).topthree{
    width: 18px;
    height: 18px;
    text-align: center;
    color: #FFFFFFFF;
    background: #F5C042FF;
    border-radius: 9px;
}
.browse-ranking li span:nth-of-type(2){
    width: 60%;
    color: #333333FF;
}
.browse-ranking li span:nth-of-type(3){
    width: 20%;
    color: #999999FF;
}
.browse-ranking li span:nth-of-type(3) i{
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    width: 20px;
    height: 12px;
    background: url(../imgs/browse.png) no-repeat center;
    background-size: 100% 100%;
}
